<span page-title>{{ 'Sync Plans' | translate }}</span>

<div data-extend-template="layouts/table-with-header.html">

  <header data-block="header">
    <h2 translate>Sync Plans</h2>
  </header>

  <div data-block="list-actions">
    <button type="button" class="btn btn-primary" ui-sref="sync-plans.new" ng-hide="denied('create_sync_plans')">
      <span translate>Create Sync Plan</span>
    </button>
  </div>

  <span data-block="no-rows-message" translate>
    You currently don't have any Sync Plans.  A Sync Plan can be created by using the button on the right.
  </span>

  <span data-block="no-search-results-message" translate>
    Your search returned zero Sync Plans.
  </span>

  <div data-block="table">
    <table class="table table-striped table-bordered" ng-class="{'table-mask': syncPlanTable.working}">
      <thead>
        <tr bst-table-head>
          <th bst-table-column="name" sortable><span translate>Name</span></th>
          <th bst-table-column="description"><span translate>Description</span></th>
          <th bst-table-column="syncDate"><span translate>Original Sync Date</span></th>
          <th bst-table-column="enabled"><span translate>Sync Enabled</span></th>
          <th bst-table-column="interval"><span translate>Interval</span></th>
          <th bst-table-column="nextSync"><span translate>Next Sync</span></th>
        </tr>
      </thead>

      <div data-extend-template="layouts/select-all-results.html"></div>

      <tbody>
        <tr bst-table-row ng-repeat="syncPlan in syncPlanTable.rows">
          <td bst-table-cell>
            <a ui-sref="sync-plan.info({syncPlanId: syncPlan.id})">
              {{ syncPlan.name }}
            </a>
          </td>
          <td bst-table-cell>{{ syncPlan.description }}</td>
          <td bst-table-cell><long-date-time date="syncPlan.sync_date" /></td>
          <td bst-table-cell>{{ syncPlan.enabled }}</td>
          <td bst-table-cell>{{ syncPlan.interval | translate | capitalize }}</td>
          <td bst-table-cell><long-date-time date="syncPlan.next_sync" /></td>
        </tr>
      </tbody>
    </table>
  </div>
</div>
